<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>flexbox</title>
    <link rel="stylesheet" href="style.css">
</head>

<body>
    <div class="container">
        <div class="item">
            <a href="#">
                <img src="car.webp" alt="加载失败...">
                <p>[第一！]第一个图片第一个图片第一个图片</p>
            </a>

        </div>
        <div class="item">
            <a href="#">
                <img src="gongzhu.webp" alt="加载失败...">
                <p>[第二！]第一个图片第一个图片第一个图片</p>
            </a>

        </div>
        <div class="item">
            <a href="#">
                <img src="huochai.webp" alt="加载失败...">
                <p>[第三！]第一个图片第一个图片第一个图片</p>
            </a>
        </div>
        <div class="item">
            <a href="#">
                <img src="koudai.webp" alt="加载失败...">
                <p>[第四！]第一个图片第一个图片第一个图片</p>
            </a>
        </div>
        <div class="item">
            <a href="#">
                <img src="terraria.webp" alt="加载失败...">
                <p>[第五！]第一个图片第一个图片第一个图片</p>
            </a>
        </div>
        <div class="item">
            <a href="#">
                <img src="yimeng.webp" alt="加载失败...">
                <p>[第六！]第一个图片第一个图片第一个图片</p>
            </a>
        </div>
        <div class="item">
            <a href="#">
                <img src="yuanshen.webp" alt="加载失败...">
                <p>[第七！]第一个图片第一个图片第一个图片</p>
            </a>
        </div>
        <div class="item">
            <a href="#">
                <img src="zhadan.webp" alt="加载失败...">
                <p>[第一！]第一个图片第一个图片第一个图片</p>
            </a>
        </div>
    </div>
</body>

</html>